<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta http-equiv="X-UA-Compatible" content="IE=8">
		<title>VR</title>
		<!--<link href="../favicon.ico" rel="icon" type="image/x-icon" />-->
		<link rel="stylesheet" href="../../bootstrap/css/bootstrap.min.css">
		<link rel="stylesheet" href="../../layui/css/layui.css">
		<link rel="stylesheet" href="../../css/swiper.min.css">
		<link rel="stylesheet" href="../../css/common.css">
		<link rel="stylesheet" href="../../css/default.css">
		<link rel="stylesheet" href="../../css/style.css">

		<!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
		<!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js?version=1.01"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js?version=1.01"></script>
    <![endif]-->

	</head>

	<body>
		<div class="top_header_wrap"></div>
		<!--#include file="../common/header.html" -->
		<!--广告-->
		<div class="banner">
			<div class="swiper-container swiper-container1">
				<div class="swiper-wrapper">
					<div class="swiper-slide"><img src="../../img/banner.jpg"></div>
					<div class="swiper-slide"><img src="../../img/banner.jpg"></div>
					<div class="swiper-slide"><img src="../../img/banner.jpg"></div>
				</div>
				<!-- Add Pagination -->
				<div class="swiper-pagination"></div>
			</div>
		</div>
		<!--内容-->
		<div class="main_container">
			<div class="layui-container">
				<div class="brumb_box">
					<a href="entrance_programs.html">招生计划</a>&gt;
					<a href="university_VR.html">高校VR全景视图</a>

				</div>
				<div class="module_box module_box_new">
					<div class="layui-row search_row">
						<h3>搜索您想要了解的学校</h3>
						<div class="search_box">
							<input type="search" class="search_input" placeholder="请输入您的关键字" /><button class="search_image"><img src="../../img/search.png"></button>
							<div class="autoTips_box">
								<ul id="autotips">
									<li>
										<img src="../../img/potrait.png" /><span>兰州大学</span>
									</li>
								</ul>
							</div>
						</div>
					</div>
					<div class="hot_university">
						<div class="layui-row hot_university_title">
							热门高校
						</div>
						<div class="layui-row hot_university_list" id="school_content">
							<div class="layui-col-lg4 layui-col-md4 layui-col-sm6 layui-col-xs12 hot_uni_item_w">
								<div class="hot_uni_item">
									<a href=""><img src="../../img/school_logo.png" />兰州交通大学</a>
								</div>
							</div>

						</div>
					</div>
				</div>

			</div>
		</div>
		<!--尾部-->
		<div class="footer_container">

		</div>
		</div>
	</body>
	<script type="text/javascript" src="../../js/jquery-1.11.0.min.js"></script>
	<script type="text/javascript" src="../../js/define.js"></script>
	<script type="text/javascript" src="../../js/swiper.min.js"></script>
	<script type="text/javascript" src="../../js/swiper.js"></script>
	<script type="text/javascript" src="../../bootstrap/js/bootstrap.min.js"></script>
	<script>
		$(document).ready(function() {

			$(".top_header_wrap").load("../common/header.html");
			$(".footer_container").load("../common/footer.html");

			/*获取热门推荐*/
			$.ajax({
				type: "get",
				url: "http://47.111.188.27:8080/gsgkzyl/vr/hot",
				success: function(h) {
					$('#school_content').empty();
					var data = h.data;
					var hotHtml = '';
					for(var i = 0; i < data.length; i++) {
						hotHtml += '<div class="layui-col-lg4 layui-col-md4 layui-col-sm6 layui-col-xs12 hot_uni_item_w">';
						hotHtml += '<a href="javascript:void(0)" onClick="window.open(\''+data[i].vr_url+'\',\'_blank\')">';
						hotHtml += '<div class="hot_uni_item">';
						hotHtml += '<img src="' + data[i].school_logo + '" />' + data[i].school_name;
						hotHtml += '</div>';
						hotHtml += '</a>';
						hotHtml += '</div>';
					}
					$('#school_content').html(hotHtml);
				}
			});

			$('.search_image').click(function() {
				var keyMajor = $('.search_input').val();
				$.ajax({
					type: "get",
					url: "http://47.111.188.27:8080/gsgkzyl/vr/search/" + keyMajor,
					success: function(maj) {
						var data = maj.data;
						if(data != null && data != "" && data != "{}" && data != "[]") {
							var schoolRankHtml = '';
							for(var i = 0; i < data.length; i++) {
								schoolRankHtml += '<div class="layui-col-lg4 layui-col-md4 layui-col-sm6 layui-col-xs12 hot_uni_item_w">';
								schoolRankHtml += '<a href="javascript:void(0)" onClick="window.open(\''+data[i].vr_url+'\',\'_blank\')">';
								schoolRankHtml += '	<div class="hot_uni_item">';
								schoolRankHtml += '<span><img src="' + data[i].school_logo + '" />' + data[i].school_name + '</span>';
								schoolRankHtml += '	</div>';
								schoolRankHtml += '</a>';
								schoolRankHtml += '</div>';

							}
							$('.hot_university_title').html('查询结果')
							$('#school_content').html(schoolRankHtml);
						} else {
							$('.hot_university_title').html('查询结果')
							$('#school_content').html('暂无数据');
							$('.pagnition').hide();
						}
					}
				})
			})

			/*自动提示*/
			function getDataTips(keytips) {
				$.ajax({
					type: "get",
					url: "http://47.111.188.27:8080/gsgkzyl/vr/autotips/" + keytips,
					success: function(a) {

						var data = a.data;
						var tipsHtml = '';
						for(var i = 0; i < data.length; i++) {
							tipsHtml += '<li>';
							tipsHtml += '<a href="javascript:void(0)" onClick="window.open(\''+data[i].vr_url+'\',\'_blank\')">';
							tipsHtml += '<img src="' + data[i].school_logo + '" /><span>' + data[i].school_name + '</span>';
							tipsHtml += '</a>';
							tipsHtml += '</li>';

						}
						$('#autotips').html(tipsHtml)
					}
				});
			}
			$('#autotips').empty();
			$('.search_input').keyup(function() {
				var keytips = $('.search_input').val();
				if(keytips.trim() == "") {
					return;
				}
				getDataTips(keytips);

			})

			$('.search_input').focus(function() {
				var keytips = $('.search_input').val();
				if(keytips.trim() == "") {
					return;
				}
				getDataTips(keytips);
			})

		});
	</script>

</html>